<template lang="pug">
  div(v-if="operateConfirmInfo.show")
    CommonDialog(:width="300", :height="210", :title="operateConfirmInfo.title || '操作提示'", :z-index="40001", :ml-z-index="30001", @close="cancel")
      template(slot="content")
        .dialog-body
          p.dialog-content(v-html="operateConfirmInfo.text")
      template(slot="footer")
        .btn-no-margin.btn-cancel(@click="cancel") {{operateConfirmInfo.leftOperateText || '取消'}}
        .btn.btn-save(@click="confirm") {{operateConfirmInfo.rightOperateText || '确定'}}
</template>

<script>
import {get} from '@utils/util'
export default {
  computed: {
    operateConfirmInfo: get('dialog/operateConfirmInfo')
  },
  methods: {
    confirm () {
      this.operateConfirmInfo.confirmCallback && this.operateConfirmInfo.confirmCallback()
      this.cancel()
    },
    cancel () {
      this.$store.set('dialog/operateConfirmInfo', {
        show: false
      })
    }
  }
}
</script>

<style scoped lang="stylus">
  .dialog-body
    height 100%
    display flex
    align-items center
    justify-content center
  .dialog-content
    font-size 16px
    color #3e3e3e
    word-break break-all
    display inline-block
    text-align justify
    text-justify inter-ideograph
    padding 0 20px
</style>
